
@extends('layouts.default')

@section('title', '')

@push('scripts')
<script>
    layui.use(['layer', 'element','form','table','laypage','laytpl','laydate'], function(){
        var layer = layui.layer;
        var form = layui.form;
        var element = layui.element;
        var table = layui.table;
        var laypage = layui.laypage;
        var laytpl = layui.laytpl;
        var laydate = layui.laydate;
        var param = {}; 
    
     
        getList(1);
     

        //日期时间范围
        laydate.render({
            elem: '#test10'
            ,type: 'date'
            ,range: true
        });
      
     

        // 查询
        form.on('submit(queryBtn)', function(data) {
            Object.assign(param, {
                    "search": data.field
            });
            getList(1);
            return false; 
        });
       
        //重置
        $('button[type=reset]').click(function(){
            $('#search-form')[0].reset();
            $('button[lay-filter=queryBtn]').click(); 
            return false;    
        })

        function getList(page){
            Object.assign(param,{"page":page});		        		        	
            getTaskList(param,function(res){		
                if(res.code == 1){
                    table.render({
                        elem: '#tablelist'
                        ,toolbar: '#toolbarDemo'
                        ,defaultToolbar:[]
                        ,data: res.data.data
                        ,limit:res.data.limit
                        ,skin:'nob'
                        ,even:true
                        //,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                        ,cols: [[ 
                        {field: 'type_text', title: '事件类型',width:'10%',align:'center'}
                        ,{field: 'name', title: '事项名称',width:'30%',align:'left'}								                  							
                        ,{field: '', title: '状态',width:'10%',align:'center',templet: function(d) {
                            if(d.status == 1){
                                return '待处理';
                            }else if(d.status == 2){
                                return '已处理';
                            }
                            return '';
                       }}
                       ,{field: 'creator_name', title: '创建人',width:'10%',align:'center'}								                  
                        ,{field: 'start_date', title: '创建时间',width:'10%',align:'center'}																
                        ,{field: 'end_date', title: '到期时间',width:'10%',align:'center'}																													
                        ,{field: '', title: '操作',toolbar: '#barDemo',width:'',align:'center'}
                        ]]
                    });

                    $('#pageBar').empty();                     
                    if(res.data.total >0){
                        //分页
                        laypage.render({
                        elem: 'pageBar' //注意，这里的 test1 是 ID，不用加 # 号
                        ,count: [res.data.total] //数据总数，从服务端得到
                        ,curr: page
                        ,layout: ['limit', 'count', 'prev', 'page', 'next',  'skip']                               
                        ,limit:res.data.limit
                        ,jump: function(obj, first) {
                                //首次不执行
                                if (!first) {
                                    Object.assign(param,{"limit":obj.limit});                                
                                    getList(obj.curr)
                                }
                            }
                        });
                    } 
                     setBtnPermission();                           
                }else {
                    layer.msg(res.msg, {icon: 5});
                } 
                                    
            })
        }



        table.on('tool(tablelist)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
     
            if(layEvent === 'check'){
                window.location.href = data.url+data.param;           
            }
        });
              

    })
</script>


<script type="text/html" id="barDemo">

    @{{# if(d.is_play == 1 && d.status ==1){ }}
    <a class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" lay-event="check"  btnPermission="204">处理</a>
    @{{# }else{ }}
    <a class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs layui-btn-disabled" lay-event=""  btnPermission="204">处理</a>
    @{{# } }}
</script>
<!---头部工具栏--->
<script type="text/html" id="toolbarDemo">
   
    <div class="list-head">
            <h3>待办事项列表</h3>
            <div class="layui-btn-container list-opt-btns">
              
            </div>
        </div>
</script>

@endpush

@section('content')
    <style>
         /* .layui-table-body{
            overflow: hidden;
        }  */
    </style>
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-row">    
                <form class="layui-form" id="search-form" >   
                    <div class="layui-form-item">             

                        <div class="layui-inline">
                            <label class="layui-form-label" >类型:</label>
                            <div class="layui-input-inline">                  
                                <select data-role="" name="type"   lay-filter="" >
                                    <option value="">请选择</option>
                                    <option value="1">审核</option>
                                    <option value="2">参与</option>
                                    <option value="3">驳回</option>
                                </select>                 
                            </div>
                        </div>


                        <div class="layui-inline">
                            <label class="layui-form-label" >状态:</label>
                            <div class="layui-input-inline">                  
                                <select data-role="" name="status"   lay-filter="" >
                                    <option value="">请选择</option>
                                    <option value="1">待处理</option>
                                    <option value="2">已处理</option>
                                </select>                 
                            </div>
                        </div>
                        
                        <!-- <div class="layui-inline"> 
                            <label class="layui-form-label">名称：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" placeholder="请填写" autocomplete="off" class="layui-input">
                            </div>
                        </div> -->

                        <div class="layui-inline" > 
                                <button lay-submit id="queryBtn" class="pear-btn pear-btn-md pear-btn-primary" lay-filter="queryBtn" >
                                    查询
                                </button>
                                <button type="reset" class="pear-btn pear-btn-md reset">
                                    重置
                                </button>
                        </div>
                    </div>

             

                </form>      
            </div>
        </div>
    </div>


    <div class="layui-card">

        <div class="layui-card-body">
            <table class="layui-table" id="tablelist" lay-filter="tablelist" ></table>
            <div class="pagebarbox" style="text-align: end"><div id="pageBar" class="pagebar"></div></div>
        </div>
    </div>
  
   
@endsection
